<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>W3Cschool在线教程(w3cschool.cn)</title>
</head>
<body>
    <div id="result"></div>
    <div id="result2"></div>
    <p><button onclick="clickCounter()" type="button">点我！</button></p>
</body>

<script>
    function printInfo(elId,str,ifAdd){
        if(true==ifAdd)
            document.getElementById(elId).innerHTML+=str;
        else
            document.getElementById(elId).innerHTML=str;
    }

    if(typeof(Storage)!=="undefined"){
        localStorage.AAA="W3Cschool在线教程";
        printInfo("result","localStorage.AAA：" + localStorage.AAA);
        printInfo("result","AAA：" + localStorage.getItem("AAA"),true);
        // localStorage.removeItem(AAA);
        // document.getElementById("result").innerHTML+="网站名：" + localStorage.AAA;

    }else{
        printInfo("result","对不起，您的浏览器不支持 web 存储。");
    }

    function clickCounter(){
        if(typeof(Storage)!=="undefined")
        {
            if (sessionStorage.clickcount){
                sessionStorage.clickcount=Number(sessionStorage.clickcount)+1;
            }else{
                sessionStorage.clickcount=1;
            }
            localStorage.clear();
            var str="在这个会话中你已经点击了该按钮 " + sessionStorage.clickcount + " 次 ";
            printInfo("result2",str);
        }else{
            printInfo("result2","抱歉，您的浏览器不支持 web 存储");
        }
    }
</script>
</html>